// http://ionicframework.com/docs/theming/

// App Global Sass
// --------------------------------------------------
// Put style rules here that you want to apply globally. These
// styles are for the entire app and not just one component.
// Additionally, this file can be also used as an entry point
// to import other Sass files to be included in the output CSS.
//
// Shared Sass variables, which can be used to adjust Ionic's
// default Sass variables, belong in "theme/variables.scss".
//
// To declare rules for a specific mode, create a child rule
// for the .md, .ios, or .wp mode classes. The mode class is
// automatically applied to the <body> element in the app.
@import '../style/component/button.scss';
@import 'reset.scss';
@import '../style/component/content-page-header.scss';
@import 'daodile.scss';
@import 'date-picker.scss';
@import 'client-detail-progress';
@import 'adp-textarea';
@import '../style/component/list-nodata';
@import '../style/component/toast';
@import 'loading';//loading样式
@import '../style/component/alert';// alert样式
@import '../style/component/picker';
@import 'device-pixel-border.scss';
@function computed-vw($px) {
    @return $px/1080*100vw;
}

textarea, input[type="range"],input[type="password"],input[type="search"], input{
    padding:0;
}

ion-header {
    .toolbar {
        height: 17.6vw;
    }
    .toolbar-background-ios {
        background-color: #ffffff;
        border: none !important;
    }
}

.toolbar-ios ion-title{
    height: 17.6vw!important;
}


.button-ios.activated{
    background:transparent;
}
/*ionic-picker和alert*/
.picker-ios .picker-button, .picker-ios .picker-button.activated {
    color: #07a963;
    font-weight: normal;
}

.picker-ios .picker-toolbar-button:last-child .picker-button {
    font-weight: normal;
}

.picker-ios .picker-below-highlight {
    //margin-top: 2vw;
}

.alert-ios [aria-checked=true] .alert-radio-inner {
    border-color: #07a963;
}

.alert-ios [aria-checked=true] .alert-radio-label {
    color: #07a963;
}

.alert-ios .alert-button {
    color: #07a963;
}

.alert-ios .alert-button:last-child {
    font-weight: normal;
}

// action-sheet 样式
.action-sheet-container{
    padding:0 computed-vw(25)!important;
}
.action-sheet-group{

    .action-sheet-title{
        height:computed-vw(140);
        line-height:computed-vw(140);
        background: linear-gradient(to right, #63b24c, #018c6e);
        color: #fff !important;
        font-size:computed-vw(45)!important;
        padding:0;
    }
    .action-sheet-button{
        color: #1f212a!important;
        font-size:computed-vw(45);
        padding: 17px;
    }
    .action-sheet-cancel{
        font-weight: normal;
    }
    .action-sheet-selected {
        color: #07a963!important;
        font-weight:normal;
    }
}
.action-sheet-ios .action-sheet-button{
    min-height:computed-vw(140);
}
.action-sheet-ios .action-sheet-group {
    border-radius: 5px;
}
/*统一loading*/
.loading-ios .spinner-circles circle{
    fill: #17ab6c;
}
.fab-bottom-shadow-list{
    width: 100vw;
    bottom: 0;
    box-shadow: 0 0 13.89vw 3.33vw rgba(0,0,0,.28);
}
.fab-bottom-shadow{
    width: 100vw;
    height:0;
    box-shadow: 0 0 15.89vw 12.33vw rgba(0, 0, 0, 0.2);
    bottom: 0;
}
/*ionic confirm弹出框样式*/
/*外框*/
.alert-wrapper{
 //   min-width: 60.18vw;
    min-width:computed-vw(650);
}
/*标题*/
.alert-ios .alert-message{
    font-size: 4.16vw;
}
.show-tabbar{
    display: none;
}

/* 验证码弹窗 begin */
.captcha-modal {
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    content: strict;
    z-index: 10;
    display: flex;
    flex-flow: column;
    align-items:center;

    ion-backdrop {
        left: 0;
        top: 0;
        position: absolute;
        z-index: 2;
        display: block;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.45);
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }

    .title {
        text-align: center;
        font-size: computed-vw(60);
        margin-top: computed-vw(110);
        color: #333;
    }

    .no-captcha {
        width: computed-vw(814);
        min-height: computed-vw(500);
        margin: auto;
        background-color: #fff;
        border-radius: computed-vw(10);
        z-index: 20;
    }

    .nc-container {
        width: computed-vw(627);
        margin: 8vw auto 6.48148vw auto;
    }
    ._nc .stage{
        padding:0;
    }
    ._nc .stage1 .slider {
        height: 10vw;
        border-radius: 5vw;
        box-shadow: 0 0 3px rgba(0, 0, 0, 0.2);
        background-color: #32bf7a;
        left: 0;
        right: 0;
        width: 100%;
        box-shadow: 0 0 computed-vw(70) rgba(0,0,0,0.2);
    }
    ._nc .stage1 .icon {
        left: 1.85vw;
        width: 6.25vw;
        height: 6.25vw;
    }
    ._nc .stage1 .label {
        color: #fff;
        -webkit-text-fill-color: #fff;
        background: transparent;
        line-height: 10vw;
        height: computed-vw(112);
    }
    ._nc .stage1 .track div {
        border-radius: 5vw;
        color: #fff;
        line-height: 10vw;
        height: 10vw;
    }
    ._nc .stage1 .button  {
        border-radius: 5vw;
        background-color: #fff;
        width: 10vw;
        height: 10vw;
    }
    ._nc .stage1 .bg-green {
        background-color: #32bf7a;
    }
    ._nc .stage1 .bg-red {
        background-color: #afafaf;
    }

    ._nc .icon-slide-arrow {
        background: url(../assets/images/login/icon_sliding.png) no-repeat center/6.25vw 6.25vw;
    }
    ._nc .icon-slide-arrow:before {
        content: none;
    }

    ._nc .icon-ok {
        background: url(../assets/images/login/icon_right.png) no-repeat center/6.25vw 6.25vw;
    }
    ._nc .icon-ok:before {
        content: none;
    }

    ._nc .icon-close {
        background: url(../assets/images/login/icon_error.png) no-repeat center/6.25vw 6.25vw;
    }
    ._nc .icon-close:before {
        content: none;
    }
    ._nc .icon-load-c {
        font-size: 6vw;
        padding-top: 0;
    }
    ._nc .icon-load-c:before {
        font-size: 6vw;
    }
    ._nc .icon-close-white:before {
        content: none;
    }
    ._nc .stage1 .icon.no {
        background-position: 0;
    }

    ._nc .stage2 .icon {
        display: none;
    }
    ._nc .stage2 .tips{
        font-size: computed-vw(42);
        margin-top: computed-vw(70);
        background-color: rgba(0,0,0,0.6);
    }
    ._nc .stage2 .textbox {
        border: none;
        border-radius: 0;
        border-bottom: 1px solid #e9e9e9;
    }
    ._nc .stage2 .textbox .input {
        left: 3vw;
        color:#333333;
    }
    ._nc .stage2 .textbox .placeholder {
        left: 4vw;
        font-size: 4.5vw;
        color:#999999;
    }
    ._nc .stage2 .textbox .code {
        right: 4vw;
        border-left:1px solid #ccc;
    }
    ._nc .stage2 .btn-ok {
        height: 10vw;
        border-radius: 5vw;
        background-color: #32bf7a;
        font-size: 4.5vw;
        margin-bottom: 0;
        margin-top: computed-vw(64);
    }

    @media only screen and (-webkit-device-pixel-ratio: 2) and (max-device-height: 568px) and (min-device-width: 320px) {
        ._nc .stage1 .icon { bottom: 0; }
    }
}

/* 验证码弹窗 end */

/* 版本校验弹窗*/
.version-modal{
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    content: strict;
    z-index: 10;
    display: flex;
    flex-flow: column;
    align-items:center;
    ion-backdrop {
        left: 0;
        top: 0;
        position: absolute;
        z-index: 2;
        display: block;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.45);
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
    }
    .version-container{
        width: computed-vw(814);
        margin: auto;
        height: computed-vw(981);
        background: url(../assets/images/common/bg_upgrade.png) no-repeat center/computed-vw(814) computed-vw(981);
        border-radius: 3vw;
        z-index: 20;
        text-align: center;
        position: relative;
        .title{
            margin-top: computed-vw(150);
            font-size: computed-vw(100);
            color: #fff;
            font-weight: 600;
        }
        .message{
            margin-top: computed-vw(30);
            font-size: computed-vw(45);
            color: #fff;
        }
        .btns{
            position: absolute;
            bottom: computed-vw(74);
            left: computed-vw(93.5);
        }
        .alert-button{
            width: computed-vw(627);
            height: computed-vw(112);
            font-size: computed-vw(42);
            color: #fff;
            background-color: #35ac63;
            line-height: computed-vw(112);
            border-radius: computed-vw(56);
            margin-bottom: computed-vw(78);
        }
        .no-update-button{
            color: #35ac63;
            font-size: computed-vw(42);
            text-align: center;
        }
    }
}
/* 版本校验弹窗 end*/
/* 网络监测弹窗 begin*/
.network-modal{
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    position: absolute;
    content: strict;
    z-index: 9999998;
    display: flex;
    flex-flow: column;
    align-items:center;
    .network-container{
        width: 100%;
        margin: auto;
        height: 100%;
        z-index: 9999999;
        text-align: center;
        position: relative;
        background:#ffffff;
        .top-empty{
            height: computed-vw(603);
            position: relative;
            background: url(../assets/images/net-error/bg.png) no-repeat center/computed-vw(1080) computed-vw(603);
            .close-btn{
                width: computed-vw(64);
                height: computed-vw(64);
                position: absolute;
                right: computed-vw(32);
                top: computed-vw(32);
                background: url(../assets/images/net-error/icon_close.png) no-repeat center/computed-vw(64) computed-vw(64);
            }
        }
        .error-image{
            position: absolute;
            top: computed-vw(400);
            width: computed-vw(400);
            height: computed-vw(400);
            border-radius: computed-vw(400);
            left: computed-vw(340);
            background: url(../assets/images/net-error/icon_BrokenNetwork.png) no-repeat center/computed-vw(400) computed-vw(400);
        }
        .title{
            margin-top: computed-vw(300);
            margin-bottom: computed-vw(30);
            font-size: computed-vw(64);
            color: #333333;
        }
        .description{
            font-size: computed-vw(48);
            color: #333333;
        }
        .alert-button{
            width: computed-vw(736);
            height: computed-vw(132);
            font-size: computed-vw(42);
            color: #fff;
            background-color: #35ac63;
            line-height: computed-vw(142);
            border-radius: computed-vw(66);
            display: inline-block;
            position: absolute;
            bottom: computed-vw(200);
            left: computed-vw(172);
        }
    }
}

/* 网络监测弹窗 end*/
/* alert 弹窗提示 begin*/
.custom-alert{
    .alert-button-group{
        .alert-button{
            color: #35ac63!important;
        }
    }
    .alert-head{
        display: block !important;
    }
    .alert-wrapper {
        height: computed-vw(390) !important;
    }
    .alert-title{
        padding:0 computed-vw(50)!important;
        font-size: computed-vw(45)!important;
        text-align: left;
        color:#333!important;
        display: block !important;
        line-height:normal!important;
    }
    .alert-message{
        margin:0 !important;
        padding:computed-vw(50)!important;
        font-size: computed-vw(45)!important;
        color:#333!important;
        text-align: left;
        line-height:normal!important;
    }
}


/* alert 弹窗提示 end*/
